<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="tfn" uri="http://www.totoro.com/functions" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>${sessionScope.user.userName}的收藏夹</title>
    <link rel="shortcut icon" type="image/x-icon" href="/static/img/index/favicon.png">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/nav.css"/>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/iconFont/iconfont.css"/>
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/css/user/collection.css"/>

</head>
<body>

<!--nav start-->
<jsp:include page="${pageContext.request.contextPath}/public_page/nav.jsp"></jsp:include>
<div style="width: 100%; height: 6px; background-color: #F2F2F2"></div>
<!-- nav end-->

<div id="fav-tab">
    <div id="fav-tab-bd">
        <div data-spm="1997992801" id="fav-tab-menu" class="clearfix floatleft">
            <a aria-label="您可以使用tab键寻找您的收藏" class="fav-logo" href="#">
                <img aria-label="欢迎访问淘宝收藏夹" src="//img.alicdn.com/tps/i1/T1gbUrFeVaXXXO7MrX-136-28.png">
            </a>
            <a class="item-page current" href="/user/baby_collect_list.htm" data-spm="d4919241">宝贝收藏</a>
            <a class="shop-page " href="/user/shop_collect_list.htm" data-spm="">店铺收藏</a>
            <div class="more-list J_FavTabMore hidden">
                <a class="buyed-page " target="_blank" href="/bought_shop_list.htm?itemtype=0" data-spm="">
                    购买过的店铺
                    <i class="i"></i>
                </a>
                <div class="more-popup">
                    <ul>
                        <li class="more-item">
                            <a class="tab-link" target="_blank" href="//trade.taobao.com/trade/itemlist/list_bought_items.htm" data-spm="d4919253">已买到的宝贝</a>
                        </li>
                        <li class="more-item">
                            <a class="tab-link" target="_blank" href="//lu.taobao.com/newMyPath.htm" data-spm="d4919261">我的足迹</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="fav-search" data-spm="">
            <div class="search " id="J_Search" role="search">
                <div class="search-panel search-sns-panel-field">
                    <form class="search-panel-focused" id="J_TSearchForm" name="search" action="/search_product.htm" target="_top">
                        <input name="_tb_token_" type="hidden" value="fe6661bbee53b">
                        <div class="search-button">
                            <button type="submit" class="btn-search">搜 索</button>
                        </div>
                        <div class="search-panel-fields">
                            <div class="search-combobox" id="ks-component117">
                                <div class="search-combobox-input-wrap">
                                    <input id="enter" name="enter" accesskey="s" autocomplete="off"
                                     x-webkit-speech="" x-webkit-grammar="builtin:translate" value="" aria-label="搜索全网请输入搜索文字或从搜索历史中选择"
                                     aria-haspopup="true" aria-combobox="list" role="combobox" class="search-combobox-input"></div>
                            </div>
                        </div>
                        <input id="J_SearchSpm" type="hidden" name="spm" value="">
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="mercury-cont">
    <div class="fav-floatbar">
        <div class="fav-bar-height">
            <div class="fav-bar-float">
                <div class="fav-bar-float-layout clearfix">
                    <div class="fav-select" data-spm="1997989129">
                        <ul>
                            <li class="fav-sel-item fav-sel-item-first J_SelItemsTags ">
                                <a class="fav-sel-link ${empty param.tab or param.tab==1?'fav-sel-select':''}" href="?tab=1&amp;t=t">全部宝贝<em>${fn:length(collectProducts)}</em></a>
                            </li>
                            <li class="fav-sel-item  ">
                                <a tabindex="-1" class="fav-sel-link ${param.tab==2?'fav-sel-select':''}" href="?tab=2&amp;t=t" data-spm="d4918973">失效<em>${fn:length(failProducts)}</em>
                                </a>
                            </li>
                            <li class="fav-sel-item ">
                                <a tabindex="-1" class="fav-sel-link ${param.tab==3?'fav-sel-select':''} " href="?tab=3&amp;t=1627260315377" data-spm="">
                                    同店宝贝
                                </a>
                            </li>
                        </ul>
                    </div>
                    <div class="fav-search cleatfix">
                        <form class="fav-search-panel-focused" id="J_FavSearchForm" name="favsearch" action="/user/baby_collect_list.htm"
                              target="_top">
                            <input class="fav-search-panel-focused-timer" name="t" type="hidden" value="1627260315380">
                            <input type="hidden" name="tab" value="1">
                            <div class="fav-search-panel-fields">
                                <input id="fav-q" name="value" accesskey="s" autocomplete="off" x-webkit-speech="" x-webkit-grammar="builtin:translate"
                                       placeholder="宝贝搜索" value="${param.value}" aria-haspopup="true" aria-combobox="list" role="combobox" class="search-combobox-input"
                                       aria-label="输入关键词搜索收藏夹内的宝贝">
                            </div>
                            <div class="fav-search-button">
                                <button type="submit" class="fav-btn-search" data-spm-click="gostr=/tbscj;locaid=d1selbtn">搜索</button>
                            </div>
                        </form>
                    </div>
                    <div class="fav-tools" data-spm="1997989129">
                        <c:if test="${param.tab !=3}">
                            <div class="J_FavTools_Open fav-tool-showbtn">
                                批量管理
                            </div>
                        </c:if>
                        <ul class="fav-tool-list">
                            <li class="fav-tool-item J_SelectAll">
                                <i class="icon-selall"></i>
                                全选
                            </li>
                            <li class="fav-tool-item J_DeleteItems" >
                                <i class="icon-delitem"></i>
                                删除
                            </li>
                            <li class="fav-tool-item J_FavTools_Close fav-tool-hidebtn">取消管理</li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <%-- 如果没有数据 空状态--%>
    <c:if test="${fn:length(sameShopBabys) < 1}" var="emptyResult">
        <div class="fav-list">
            <div class="no-fav-result clearfix">
                <div class="no-pic">
                    <img src="//img.alicdn.com/tps/i2/TB16ztmHFXXXXX7XFXXIrnAJFXX-89-89.png">
                </div>
                <div class="no-result-tips">
                    <p class="big-font">你还没收藏过宝贝哦</p>
                    <p><a target="_blank" href="/">去随便逛逛吧</a>，看看有没有喜欢的</p>
                </div>
            </div>
        </div>
    </c:if>
    <c:if test="${param.tab == 3}">
    <div id="fav-list">
        <ul class="img-item-list J_FavList clearfix">
            <c:forEach items="${sameShopBabys}" var="baby">
            <li class="fav-shop clearfix" data-id="" data-ownerid="666409347" data-shopid="64613804" data-spm="1997985097">
                <div class="shop-card g-sl-l-item clcearfix">
                    <div class="shop-card-side">
                        <div class="logo">
                            <a href="/shop/view_shop?brandId=${baby.key.id}" target="_blank" data-spm="">
                                <img class="logo-img" src="${fn:length(baby.key.shopHead) < 1?'https://wwc.alicdn.com/avatar/getAvatar.do?userId=4040151018&width=60&height=60&type=sns':'/static/img/seller/shop/'+=baby.key.shopHead}" data-spm="">
                            </a>
                        </div>
                    </div>
                    <div class="shop-name">
                        <img class="tmallicon" src="//img.alicdn.com/tps/i3/T1DgeGFdNbXXbXX2Hb-24-18.png">
                        <a class="shop-name-link" title="${baby.key.shopName}" target="_blank" href="//store.taobao.com/?shop_id=64613804" data-spm="">
                                ${baby.key.shopName}
                        </a>
                    </div>
                    <div class="seller">
                        <a class="seller-link" href="//store.taobao.com/?shop_id=64613804" target="_blank" data-spm="">
                            ${baby.key.seller.sellerName}
                        </a>
                        <span class="ww-light ww-small" data-nick="${baby.key.shopName}" data-icon="small" data-spm="">
                            <a target="_blank" class="ww-inline ww-online" title="点此可以直接和卖家交流选好的宝贝，或相互交流网购体验，还支持语音视频噢。" data-to-uid="${baby.key.slid}"><span>旺旺在线</span></a></span>
                    </div>
                    <div class="same-shop-num">
                        同店收藏 ${fn:length(baby.value)}
                    </div>
                    <div class="fav-shop-box">
                        <div class="fshop-info-others-f floatleft">
                            <a href="/popup/add_collection.htm?id=64613804&amp;itemtype=0&amp;_tb_token_=xzn0b1UJ4W4hAzhcw9mB" class="J_TDialogTrigger">
                                <span class="J_FIconFace starticonfont"></span>
                                <span class="J_FIconFace_Txt">收藏店铺</span>
                            </a>
                        </div>
                    </div>
                </div>
                <div class="item-list-box">
                    <div class="item-list">
                        <ul class="item-list-ul cleatfix">
                            <c:forEach items="${baby.value}" var="collect" varStatus="vs">
                                    <li class="J_FavListItem g-i-item fav-item ${collect.product.isLanunched == 0 or collect.product.isDelete == 1?'isinvalid':''}" data-pid="${collect.product.id}" data-clid="${collect.id}">
                                        <div class="img-controller-box J_FavImgController">
                                            <div class="img-controller-img-box">
                                                <a href="/buy.htm?pid=${collect.product.id}" class="img-controller-img-link" target="_blank"title="${collect.product.productName}">
                                                    <img class="img-controller-img" src="${collect.product.productImages.get(0).imagePath}"
                                                         alt="${collect.product.productName}">
                                                </a>
                                            </div>
                                            <a tabindex="-1" class="findsame-btn" href="/search_product.htm?enter=${fn:substring(collect.product.productName, 1, 5)}"
                                               target="_blank" data-spm="">找相似</a>
                                            <a tabindex="-1" class="go-shop-link" target="_blank" href="/shop/view_shop.htm?brandId=${collect.product.shop.id}"
                                               title="进入店铺">进入店铺</a>
                                            <div class="delete-box" data-spm="">
                                                <div class="delete-btn-bg"></div>
                                                <div class="delete-btn J_DeleteItem" title="删除宝贝"></div>
                                            </div>
                                            <div class="note">
                                                <div class="note-bg"></div>
                                                <div class="note-txt">
                                                    <span class="note-txt-icon"></span>
                                                    添加备注
                                                </div>
                                            </div>
                                        </div>
                                        <c:if test="${collect.product.isDelete == 0 && collect.product.isLanunched == 1}" var="isL">
                                            <div class="price-container">
                                                <div class="g_price-box">
                                                    <c:if test="${collect.product.nowPrice < collect.product.beforePrice}">
                                                        <div data-title="undefined;直降:${tfn:formatNumber(collect.product.nowPrice - collect.product.beforePrice, 2)}元" class="J_PriceIcon_ picon-">
                                                            <!-- 促 -->
                                                        </div>
                                                        <div class="g_price">
                                                            <span>¥</span>
                                                            <strong>${tfn:formatNumber(collect.product.nowPrice, 2)}</strong>
                                                        </div>
                                                        <div class="g_price g_price-original">
                                                            <span>¥</span>
                                                            <span>${tfn:formatNumber(collect.product.beforePrice, 2)}</span>
                                                        </div>
                                                    </c:if>
                                                    <c:if test="${collect.product.nowPrice > collect.product.beforePrice or collect.product.nowPrice == collect.product.beforePrice}">
                                                        <div class="g_price">
                                                            <span>¥</span>
                                                            <strong>${tfn:formatNumber(collect.product.nowPrice, 2)}</strong>
                                                        </div>
                                                    </c:if>
                                                </div>
                                            </div>
                                        </c:if>
                                        <c:if test="${!isL}">
                                            <div class="knockdown">
                                                <div class="knockdown-picon"></div>
                                                <span class="knockdown-tips">宝贝失效了</span>
                                            </div>
                                        </c:if>
                                        <div class="edit-pop">
                                            <div class="edit-pop-bg"></div>
                                            <div class="edit-pop-border"></div>
                                            <div class="edit-pop-btn J_Edit_Pop_Btn" data-spm-click="gostr=/tbscj;locaid=d3sel">
                                                <i class="edit-icon"></i>
                                                <div class="item-pk-txt J_Item_PKtxt"></div>
                                            </div>
                                        </div>
                                        <div class="del-pop">
                                            <div class="del-pop-bg"></div>
                                            <div class="del-pop-box">
                                                <div class="txt">确定删除？</div>
                                                <div class="btns">
                                                    <div class="J_DeleteItem_Ok btn-ok" data-spm-click="gostr=/tbscj;locaid=d3delok">确定</div>
                                                    <div class="J_DeleteItem_Close btn-close" data-spm-anchor-id="a1z0k.7386009.0.i3.60b636f7hn3s70">取消</div>
                                                </div>
                                            </div>
                                        </div>
                                    </li>
                            </c:forEach>
                        </ul>
                    </div>
                </div>
                <div class="edit-pop">
                    <div class="edit-pop-bg"></div>
                    <div class="edit-pop-border"></div>
                    <div class="edit-pop-btn J_Edit_Pop_Btn" data-spm-click="gostr=/tbscj;locaid=d3sel">
                        <i class="edit-icon"></i>
                    </div>
                </div>
            </li>
            </c:forEach>
        </ul>
        <div id="loading-img">正在加载</div>
    </div>
    </c:if>

    <c:if test="${param.tab != 3}">
    <div id="fav-list">
        <ul class="img-item-list J_FavList clearfix" data-spm-anchor-id="a1z0k.7386009.0.i3.195b110bDhfu37">
            <c:forEach items="${empty param.tab or param.tab==1?collectProducts:failProducts}" varStatus="vs" var="collect">
                <li class="J_FavListItem g-i-item fav-item ${collect.product.isLanunched == 0 or collect.product.isDelete == 1?'isinvalid':''}" data-pid="${collect.product.id}" data-clid="${collect.id}">
                    <div class="img-controller-box J_FavImgController">
                        <div class="img-controller-img-box">
                            <a href="/buy.htm?pid=${collect.product.id}" class="img-controller-img-link" target="_blank"title="${collect.product.productName}">
                                <img class="img-controller-img" src="${collect.product.productImages.get(0).imagePath}"
                                     alt="${collect.product.productName}">
                            </a>
                        </div>
                        <a tabindex="-1" class="findsame-btn" href="/search_product.htm?enter=${fn:substring(collect.product.productName, 1, 5)}"
                           target="_blank" data-spm="">找相似</a>
                        <a tabindex="-1" class="go-shop-link" target="_blank" href="/shop/view_shop.htm?brandId=${collect.product.shop.id}"
                           title="进入店铺">进入店铺</a>
                        <div class="delete-box" data-spm="">
                            <div class="delete-btn-bg"></div>
                            <div class="delete-btn J_DeleteItem" title="删除宝贝"></div>
                        </div>
                        <div class="note">
                            <div class="note-bg"></div>
                            <div class="note-txt">
                                <span class="note-txt-icon"></span>
                                添加备注
                            </div>
                        </div>
                    </div>
                    <div class="img-item-title">
                        <a class="jpmjicon-box" href="//www.taobao.com/go/act/jpmj.php" target="_blank">
                            <img class="jpmjicon" src="//img.alicdn.com/tps/i3/T1DgeGFdNbXXbXX2Hb-24-18.png">
                        </a>
                        <a class="img-item-title-link" title="${collect.product.productName}" target="_blank" href="/buy.htm?pid=${collect.product.id}">${collect.product.productName}</a>
                    </div>
                    <c:if test="${collect.product.isDelete == 0 && collect.product.isLanunched == 1}" var="isL">
                    <div class="price-container">
                        <div class="g_price-box">
                            <c:if test="${collect.product.nowPrice < collect.product.beforePrice}">
                                <div data-title="undefined;直降:${tfn:formatNumber(collect.product.nowPrice - collect.product.beforePrice, 2)}元" class="J_PriceIcon_ picon-">
                                    <!-- 促 -->
                                </div>
                                <div class="g_price">
                                    <span>¥</span>
                                    <strong>${tfn:formatNumber(collect.product.nowPrice, 2)}</strong>
                                </div>
                                <div class="g_price g_price-original">
                                    <span>¥</span>
                                    <span>${tfn:formatNumber(collect.product.beforePrice, 2)}</span>
                                </div>
                            </c:if>
                            <c:if test="${collect.product.nowPrice > collect.product.beforePrice or collect.product.nowPrice == collect.product.beforePrice}">
                                <div class="g_price">
                                    <span>¥</span>
                                    <strong>${tfn:formatNumber(collect.product.nowPrice, 2)}</strong>
                                </div>
                            </c:if>
                        </div>
                    </div>
                    </c:if>
                    <c:if test="${!isL}">
                        <div class="knockdown">
                            <div class="knockdown-picon"></div>
                            <span class="knockdown-tips">宝贝失效了</span>
                        </div>
                    </c:if>
                    <div class="edit-pop">
                        <div class="edit-pop-bg"></div>
                        <div class="edit-pop-border"></div>
                        <div class="edit-pop-btn J_Edit_Pop_Btn" data-spm-click="gostr=/tbscj;locaid=d3sel">
                            <i class="edit-icon"></i>
                            <div class="item-pk-txt J_Item_PKtxt"></div>
                        </div>
                    </div>
                    <div class="del-pop">
                        <div class="del-pop-bg"></div>
                        <div class="del-pop-box">
                            <div class="txt">确定删除？</div>
                            <div class="btns">
                                <div class="J_DeleteItem_Ok btn-ok" data-spm-click="gostr=/tbscj;locaid=d3delok">确定</div>
                                <div class="J_DeleteItem_Close btn-close" data-spm-anchor-id="a1z0k.7386009.0.i3.60b636f7hn3s70">取消</div>
                            </div>
                        </div>
                    </div>
                </li>
            </c:forEach>
        </ul>
        <div id="loading-img">正在加载</div>
    </div>
    </c:if>
    <div class="page-nav-box-none"></div>

</div>
<div id="ks-component353" class="fpublictips-overlay" style="width: 328px; height: 197px; z-index: 20010; left: 786.5px; top: 159.01px; display: none;">
    <div id="ks-content-ks-component354" class="fpublictips-overlay-content">
        <a class="J_FPublicTips_Close fpublictips-close" href="#nogo" title=""></a>
        <div class="line1">亲，请先选择要删除的宝贝或店铺～</div>
        <div class="line2">
            <a class="J_FPublicTips_OK fpublictips-btn bg-red not" href="#nogo" title="">确 定</a>
        </div>
    </div>
</div>

<div id="ks-component354" class="fpublictips-overlay" style="width: 328px; height: 179px; z-index: 20010; left: 786.5px; top: 168.01px; display: none;">
    <div id="ks-content-ks-component354"
         class="fpublictips-overlay-content">
        <a class="J_FPublicTips_Close fpublictips-close" href="#nogo" title=""></a>
        <div class="line1">确定删除？</div>
        <div class="line2">
            <a class="J_FPublicTips_OK fpublictips-btn bg-red ok" href="#nogo" title="">确 定</a>
            <a class="J_FPublicTips_Close fpublictips-btn not" href="#nogo" title="">取 消</a>
        </div>
    </div>
</div>
<!-- tail-->
<jsp:include page="${pageContext.request.contextPath}/public_page/last.html"></jsp:include>
<jsp:include page="/public_page/open_chat.jsp"></jsp:include>
<!-- main end-->
<script type="text/javascript" src="${pageContext.request.contextPath}/static/js/frame/jquery-3.5.1.min.js"></script>
<script>
    $(function(){
        $(".fav-tool-showbtn").click(function(){
            $('.fav-tool-list').show();
            $(this).hide();
            $('.edit-pop').show();
        });

        $('.fav-tool-hidebtn').click(function(){
            $('.fav-tool-list').hide();
            $(".fav-tool-showbtn").show();
            $('.edit-pop').hide();
        });

        $('.edit-pop').click(function(){
            var _this=$(this).find('.edit-icon');
            if(_this.hasClass("edit-k")==true){
                _this.removeClass("edit-k");
                $('.edit-pop-border').removeClass("ad");
                $('.J_Edit_Pop_Btn').removeClass("ad");
            }else{
                _this.addClass("edit-k");
                $('.J_Edit_Pop_Btn').addClass("ad");
                $('.edit-pop-border').addClass("ad");
            }

        });

        $('.J_SelectAll').click(function(){
            if($('.J_SelectAll').hasClass("fav-tool-item-selall")==true){
                $('.J_SelectAll').removeClass("fav-tool-item-selall");
                $('.edit-icon').removeClass("edit-k");
                $('.edit-pop-border').removeClass("ad");
                $('.J_Edit_Pop_Btn').removeClass("ad");
            }else{
                $('.J_SelectAll').addClass("fav-tool-item-selall");
                $('.edit-icon').addClass("edit-k");
                $('.J_Edit_Pop_Btn').addClass("ad");
                $('.edit-pop-border').addClass("ad");
            }

        });

        $('.J_FavImgController').hover(function () {
            $(this).parents(".J_FavListItem").addClass("fav-item-hover");
        },function () {
            $(this).parents(".J_FavListItem").removeClass("fav-item-hover");
        });

        // 点击删除宝贝
        $(".delete-btn").click(function () {
            $(this).parents(".J_FavListItem").addClass("del-pop-show");
        });

        // 确定删除
        $(".btn-ok").click(function () {
            var pid = $(this).parents(".J_FavListItem").attr("data-pid");
            $.post("/productBuy_logic/cancelCollectProduct.htm", {"pid": pid}, res =>{
                if(res == 'success'){
                    $(this).parents(".J_FavListItem").remove();
                }
            });
        });

        // 取消删除
        $(".btn-close").click(function () {
            $(this).parents(".J_FavListItem").removeClass("del-pop-show");
        })
    });

    // 点击批量删除，如果没有选中，则提示
    $(".J_DeleteItems").click(function () {
        var length = $(".edit-k").length;
        if(length == 0){
            $("#ks-component353").fadeIn(400);
            return false;
        }
        $("#ks-component354").fadeIn(400);
    });

    // 关闭框
    $(".not, .fpublictips-close").click(function () {
        $(".fpublictips-overlay").fadeOut(400);
    });

    // 确认批量删除
    $(".ok").click(function () {
        var clids = new Array();
        $(".edit-k").each(function () {
            clids.push($(this).parents(".J_FavListItem").attr("data-clid"));
        });
        $.post("/productBuy_logic/batchCancelCollectProduct.htm", {"clids": clids}, function (res) {
            if(res == "success"){
                $(".edit-k").each(function () {
                    $(this).parents(".J_FavListItem").remove();
                    $(".fpublictips-overlay").fadeOut(400);
                });
            }
        })
    })
</script>
</body>
</html>
